<%--
  Created by IntelliJ IDEA.
  User: Administrator
  Date: 2018/5/15
  Time: 11:12
  To change this template use File | Settings | File Templates.
--%>
<%@include file="common/common-header.jsp"%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>${Title}</title>
    <style type="text/css">
        body {background-image: url(${domainStaticUrl}/img/poster.jpg);}
        .message{
            position: absolute;
            top:-140px;
            bottom: 0px;
            left: 0px;
            right: 0px;
            margin: auto;
            color:red;
        }
        .message{
            width: 512px;
            height: 200px;
            position: absolute;
            background-image: -webkit-linear-gradient(left,blue,#66ffff 10%,#cc00ff 20%,#CC00CC 30%, #CCCCFF 40%, #00FFFF 50%,#CCCCFF 60%,#CC00CC 70%,#CC00FF 80%,#66FFFF 90%,blue 100%);
            -webkit-text-fill-color: transparent;/* 将字体设置成透明色 */
            -webkit-background-clip: text;/* 裁剪背景图，使文字作为裁剪区域向外裁剪 */
            -webkit-background-size: 200% 100%;
            -webkit-animation: masked-animation 4s linear infinite;
            font-size: 35px;
        }
        .about{
            width:855px;
            height: 200px;
            position: relative;
            margin-left: -200px;
            background-image: -webkit-linear-gradient(left,blue,#66ffff 10%,#cc00ff 20%,#CC00CC 30%, #CCCCFF 40%, #00FFFF 50%,#CCCCFF 60%,#CC00CC 70%,#CC00FF 80%,#66FFFF 90%,blue 100%);
            -webkit-text-fill-color: transparent;/* 将字体设置成透明色 */
            -webkit-background-clip: text;/* 裁剪背景图，使文字作为裁剪区域向外裁剪 */
            -webkit-background-size: 200% 100%;
            -webkit-animation: masked-animation 4s linear infinite;
            font-size: 25px;
        }
    </style>
</head>
<body>

    <div id="app" v-cloak>
        <div class="message">
            <p>{{message}}</p>
            <p class="about">{{about}}</p>
        </div>
    </div>
</body>
<script type="text/javascript">
    $(function(){
        var vue=new Vue({
            el:'#app',
            data:{
                domain:{},
                message:'Welcome to Mr.ou Retomar web',
                about:'鼠标右键看看，右键一次打开菜单，再次右键或者鼠标移出菜单左键关闭菜单'
            }
        })
    })
</script>
</html>
